<template>
  <view class="eshop-consult-block"
    :style="{backgroundImage:'url('+staticImgs.bg+')'}"
    @click="toEshopConsultPage"
  >
    <image  class="btn-img" :src="staticImgs.btnImg" mode=""></image>
    <view class="price-box">
      <text class="unit">¥</text>
      <text class="price">{{price || ''}}</text>
    </view>
  </view>
</template>

<script>
  
  export default {
    data(){
      return {
         staticImgs:{
           bg: this.imgBaseURL + '/consult/eshop-consult-block-v5.png',
           btnImg:this.imgBaseURL + '/consult/eshop-consult-block-btn-v3.png',
         },
         goodsList:[],
         price:null
      }
    },
    created() {
      this.$u.api.getEshopConsultGoodsList().then(res => {
        if(res.data.code == 200){
          const {data:dRes} = res.data
          this.goodsList = dRes
          this.price = dRes[0].price
        }
      })
    },
    methods:{
      toEshopConsultPage(){
        uni.navigateTo({
        	url: '/subcontractorA/pages/eshopConsult/eshopConsult'
        })
      }
    }
  }
</script>

<style lang="scss" scoped>
  @keyframes loading {
  	0% {
  		transform: scale(1);
  	}
    50% {
    	transform: scale(.78);
    }
  	100% {
  		transform: scale(1);
  	}
  }
  
  .eshop-consult-block{
    
    
    width: 720rpx;
    height: 154rpx;
    background-size: cover;
    background-repeat: no-repeat;
    display: flex;
    justify-content: flex-end;
    position: relative;
    
    .price-box{
      position: absolute;
      left: 228rpx;
      bottom: 1rpx;
      
      .unit{
        font-family: PingFangSC, PingFang SC;
        font-weight: 500;
        font-size: 36rpx;
        color: #FF7CC1;
        line-height: 50rpx;
        text-align: left;
        font-style: normal;
      }
      .price{
        font-family: SourceHanSansCN, SourceHanSansCN;
        font-weight: bold;
        font-size: 46rpx;
        color: #FF76B9;
        line-height: 69rpx;
        text-align: left;
        font-style: normal;
      }
    }
    
    .btn-img{
      width: 130rpx;
      height: 130rpx;
      margin-right: 24rpx;
      margin-top: 26rpx;
      
      animation-iteration-count: infinite;
      animation-name: loading;
      animation-duration: 1900ms;
      animation-delay: 0;
      animation-timing-function: ease;
    }
  }
</style>